<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>接口管理</title>
    <link rel="stylesheet" href="/frame/layui/css/layui.css">
    <link rel="stylesheet" href="/css/style.css">
    <link rel="icon" href="/image/code.png">
    <style type="text/css">
    	.layui-nav-more{
    		display:none;
    	}
    </style>
</head >
<body style="display: " id='bodyId'>
<!-- admin -->
<div class="layui-layout layui-layout-admin"> <!-- 添加skin-1类可手动修改主题为纯白，添加skin-2类可手动修改主题为蓝白 -->
    <!-- header -->
    <div class="layui-header my-header">
        <a href="${basePath}/index">
            <!--<img class="my-header-logo" src="" alt="logo">-->
            <div class="my-header-logo">接口管理</div>
        </a>
        <div class="my-header-btn">
            <button class="layui-btn layui-btn-small btn-nav"><i class="layui-icon">&#xe620;</i></button>
        </div>
        <ul class="layui-nav" lay-filter="side-left">
            <li class="layui-nav-item" onclick="addOrEditModule('')">
            	<a href="javascript:;" href-url="demo/btn.html"><i class="layui-icon">&#xe621;</i>添加模块</a>
            </li>
            <li class="layui-nav-item" onclick="addOrEditApi('')">
                <a href="javascript:;"><i class="layui-icon">&#xe621;</i>添加API菜单</a>
            </li>
            <li class="layui-nav-item" onclick="saveDomain()">
                <a href="javascript:;"><i class="layui-icon">&#xe621;</i>添加域名组</a>
            </li>
            <li class="layui-nav-item" onclick="selectDelDomain()">
                <a href="javascript:;"><i class="layui-icon">&#xe621;</i>【查看/删除】域名组</a>
            </li>
            
<!--              <li class="layui-nav-item" onclick="" style=""> -->
<!--                 <a href="javascript:;"><i class="layui-icon">&#xe621;</i>导出word文档</a> -->
<!--             </li> -->
        </ul>
        <ul class="layui-nav my-header-user-nav" lay-filter="side-right">
            <li class="layui-nav-item">
                <a class="name" href="javascript:;" style=""><img src="/image/code.png" alt="logo"> ${hideProjectName!projectName} </a>
                <dl class="layui-nav-child">
<!--                     <dd><a href="javascript:;" href-url="demo/login.html"><i class="layui-icon">&#xe621;</i>登录页</a></dd> -->
<!--                     <dd><a href="javascript:;" href-url="demo/map.html"><i class="layui-icon">&#xe621;</i>图表</a></dd> -->
                    <dd><a href="javascript:" onclick="goProjectList()">返回</a></dd>
                </dl>
            </li>
        </ul>
    </div>
    <!-- side -->
    <div class="layui-side my-side">
        <div class="layui-side-scroll">
            <ul id="menusId" class="layui-nav layui-nav-tree" lay-filter="side">
<!--                 <li class="layui-nav-item layui-nav-itemed"> -->
<!--                     <a href="javascript:;" class="showSet" moduleId=""> -->
<!--                     	<div class="layui-input-inline" style="width: 150px;word-wrap:break-word; word-break:break-all; overflow: hidden;text-overflow:ellipsis;"> -->
<!--                     	<span> -->
<!--                     		<i class="layui-icon">&#xe620;</i>基础基础基础基础基础基础基础基础基础基础基础 -->
<!--                     	</span> -->
<!--                     	</div> -->
<!-- 					</a> -->
<!--                     <dl class="layui-nav-child"> -->
<!--                         <dd class="layui-nav-item apiSet"><a href="javascript:;" href-url="${basePath}/project/projectList"><i class="layui-icon">&#xe621;</i>新建项目</a></dd> -->
<!--                     </dl> -->
<!--                 </li> -->
            </ul>
        </div>
    </div>
    <!-- body -->
    <div class="layui-body my-body">
        <div class="layui-tab layui-tab-card my-tab" lay-filter="card" lay-allowClose="true">
            <ul class="layui-tab-title">
                <li class="layui-this" lay-id="0"><span>欢迎页</span></li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <iframe id="iframe" src="${basePath}/index/home" frameborder="0"></iframe>
                </div>
            </div>
        </div>
    </div>
</div>


<!-- pay -->
<div class="my-pay-box none">
    <div><img width="93%" height="85%" src="${basePath}/image/zfb.png" alt="支付宝"><p>支付宝</p></div>
    <div><img width="93%" height="85%" src="${basePath}/image/wx.png" alt="微信"><p>微信</p></div>
</div>
<script type="text/javascript" src="/frame/layui/layui.js"></script>
<script type="text/javascript" src="/js/index.js"></script>
<script type="text/javascript" src="/js/jquery-1.4.4.min.js"></script>
<!-- <script src="${basePath}/frame/layui/lay/dest/layui.all.js" charset="utf-8"></script> -->
<!-- 模板引擎 -->
<script src="/js/template/template.js" charset="utf-8"></script>
<script src="/js/template/templateUtil.js" charset="utf-8"></script>
<script id="menus_tmp" type="text/html">
{{each moduleList as value i}}
	<li class="layui-nav-item layui-nav-itemed">
	<a href="javascript:;" class="showSet" moduleId="{{value.id}}">
		<div class="layui-input-inline" style="width: 150px;word-wrap:break-word; word-break:break-all; overflow: hidden;text-overflow:ellipsis;">
		<span>
			<i class="layui-icon">&#xe620;</i>{{value.name}}
		</span>
		</div>
	</a>
	<dl class="layui-nav-child">
		{{each apiList as apiValue j}}
		{{if value.id==apiValue.moduleId}}
			<dd class="layui-nav-item apiSet" api_id={{apiValue.id}}><a href="javascript:;" href-url="${basePath}/api/index?apiId={{apiValue.id}}"><i class="layui-icon">&#xe621;</i>{{apiValue.name}}</a></dd>
		{{/if}}
		{{/each}}
	</dl>
	</li>
{{/each}}
</script>
<script>
	function updateMenus(){
		$.ajax({
            type: "POST",
            url: "${basePath}/module/getMenusInfo",
            data: {"projectId":"${project_id!}"},
            dataType: "json",
            success: function(data){
            	if(data.isSuccess){
            		var html = template("menus_tmp", data.dataMap);
            		$("#menusId").html(html);
            		//从新绑定事件
            		bindEvents();
            	}
            },
            error: function(data){
            	layer.msg("网络错误！");
            }
        });
	}
	updateMenus();
</script>
<script>
function addOrEditModule(module_id){
	var title = "添加模块";
	if(isNotNull(module_id)){
		title = "编辑模块";
	}
	layui.use('layer', function(){
		layer.open({
			  type: 2,
			  title: title,
			  shadeClose: true,
			  shade: 0.8,
			  area: ['480px', '300px'],
			  content: '${basePath}/module/saveOrEditModule?project_id=${project_id!}&&moduleId='+module_id //iframe的url
			  ,end:function(){
				  updateMenus();
			  }		
		}); 
	});  
	
}
function deleteModule(moduleId){
	$.ajax({
        type: "POST",
        url: "${basePath}/module/deleteModule",
        data: {"module_id":moduleId},
        dataType: "json",
        success: function(data){
        	if(data.isSuccess){
        		layer.msg(data.message,{time: 500});
        		 updateMenus();
        		 hideSetDivs();
        	}else{
        		layer.msg(data.message,{time: 3000});
        	}
        },
        error: function(data){
        	layer.msg("网络错误！");
        }
    });
}

function saveDomain(){
	var title = "添加域名组";
	
	layui.use('layer', function(){
		layer.open({
			  type: 2,
			  title: title,
			  shadeClose: true,
			  shade: 0.8,
			  area: ['480px', '360px'],
			  content: '${basePath}/project/saveDomain?project_id=${project_id!}' //iframe的url
			  ,end:function(){
				  updateMenus();
			  }	
		}); 
	});  
}
function selectDelDomain(){
	var title = "【查看/删除】域名组";
	layui.use('layer', function(){
		layer.open({
			  type: 2,
			  title: title,
			  shadeClose: true,
			  shade: 0.8,
			  area: ['800px', '500px'],
			  content: '${basePath}/project/selectDelDomain?project_id=${project_id!}' //iframe的url
			  ,end:function(){
				  updateMenus();
			  }	
		}); 
	});  
}
function addOrEditApi(api_id){
	var title = "添加API接口";
	if(isNotNull(api_id)){
		title = "编辑API接口";
	}
	layui.use('layer', function(){
		layer.open({
			  type: 2,
			  title: title,
			  shadeClose: true,
			  shade: 0.8,
			  area: ['480px', '260px'],
			  content: '${basePath}/api/saveOrEdit?project_id=${project_id!}&api_id='+api_id //iframe的url
			  ,end:function(){
				  updateMenus();
			  }	
		}); 
	});  
}
function deleteApi(api_id){
	$.ajax({
        type: "POST",
        url: "${basePath}/api/deleteApi",
        data: {"api_id":api_id},
        dataType: "json",
        success: function(data){
        	if(data.isSuccess){
        		layer.msg(data.message,{time: 500});
        		updateMenus();
        		hideSetDivs();
        	}else{
        		layer.msg(data.message,{time: 3000});
        	}
        },
        error: function(data){
        	layer.msg("网络错误！");
        }
    });
}
</script>
<script type="text/javascript">
    window.onload = function ()
    {
        var table = document.getElementById ('bodyId');
        table.oncontextmenu = function ()
        {
            return false;
        }
    }
</script>
<script>
function mousePosition(ev){ if(ev.pageX || ev.pageY){ return {x:ev.pageX, y:ev.pageY}; } return { x:ev.clientX + document.body.scrollLeft - document.body.clientLeft, y:ev.clientY + document.body.scrollTop - document.body.clientTop }; } 
function bindShowSetMousedown(){
	//先解绑事件 在绑定事件
	$('.layui-nav-item  .showSet').unbind("mousedown");
	$('.layui-nav-item  .showSet').bind("mousedown",function(e){ 
		e.preventDefault()
		if(e.which==3){
			//module
// 			addOrEditModule
			//绑定事件
			var moduleId = $(this).attr("moduleId");
			$('.showSetDiv .setDivEdit .layui-btn').unbind("click")
			$(".showSetDiv .setDivEdit .layui-btn").bind("click",function(){
				var tempModuleId = moduleId;
				addOrEditModule(tempModuleId);
			});
			
			$('.showSetDiv .setDivDel .layui-btn').unbind("click")
			$(".showSetDiv .setDivDel .layui-btn").bind("click",function(){
				var tempModuleId = moduleId;
				
				deleteModule(tempModuleId);
			});
			
			
			$("#showSetDiv").css("top",mousePosition(e).y);
			$("#showSetDiv").css("left",mousePosition(e).x);
			$("#showSetDiv").show();
		}
		return false;
	});
}

function bindApiSetMousedown(){
	//先解绑事件 在绑定事件
	$('.layui-nav-child  .apiSet').unbind("mousedown");
	$('.layui-nav-child  .apiSet').bind("mousedown",function(e){ 
		e.preventDefault()
		if(e.which==3){
			//api
			var api_id = $(this).attr("api_id");
			$('.showSetDiv .setDivEdit .layui-btn').unbind("click")
			$(".showSetDiv .setDivEdit .layui-btn").bind("click",function(){
				var tempApiId = api_id;
				addOrEditApi(tempApiId);
			});
			
			$('.showSetDiv .setDivDel .layui-btn').unbind("click")
			$(".showSetDiv .setDivDel .layui-btn").bind("click",function(){
				var tempApiId = api_id;
				
				deleteApi(tempApiId);
			});
			
			$("#showSetDiv").css("top",mousePosition(e).y);
			$("#showSetDiv").css("left",mousePosition(e).x);
			$("#showSetDiv").show();
		}
		return false;
	});
}

function showSetDivs(){
	$(".showSetDiv").show();
}
function hideSetDivs(){
	$(".showSetDiv").hide();
}
function bindEvents(){
	bindShowSetMousedown();
	bindApiSetMousedown();
	element.init();
}

function goProjectList(){
	window.location.href="${basePath}/index/";
}

</script>
<div id="showSetDiv" onmousemove="showSetDivs()" onmouseout="hideSetDivs()" class="layui-input-inline showSetDiv" style="width: 35px;height:45px;position: relative;top:10px;left: 10px;z-index: 999;display: none;">
    <div class="layui-input-inline setDivEdit"  style="width: 40px;">
    	<button class="layui-btn layui-btn-normal layui-btn-mini">编辑</button>
    </div>
    <div class="layui-input-inline setDivDel"  style="width: 40px;">
    	<button class="layui-btn layui-btn-warm layui-btn-mini">删除</button>
    </div>
</div>
</body>
</html>